Skip to content

Conversation

nicokant
Copy link
Contributor

@nicokant nicokant commented Aug 4, 2025

Reasons for making this change

Updating the documentation to make sure the theme works with Tailwind@4 and DaisyUI@5.
It's necessary to explicitly include the source to allow tailwind discovery of the classes in the module

Checklist

  • I'm updating documentation
  • I'm adding or updating code
    • I've added and/or updated tests. I've run npx nx run-many --target=build --exclude=@rjsf/docs && npm run test:update to update snapshots, if needed.
    • I've updated docs if needed
    • I've updated the changelog with a description of the PR
  • I'm adding a new feature
    • I've updated the playground with an example use of the feature

Copy link
Member

@heath-freenome heath-freenome left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Trusting that this documentation update is accurate

@heath-freenome heath-freenome merged commit 78c8e3d into rjsf-team:main Aug 11, 2025
4 checks passed
chathuraa added a commit to chathuraa/react-jsonschema-form that referenced this pull request Aug 12, 2025
… fields

The change includes:
- documentation with TypeScript examples
- Updated array and uiSchema documentation to reference the new capabilities

Closes rjsf-team#4706
heath-freenome added a commit that referenced this pull request Aug 12, 2025
* feat(ArrayField): add dynamic uiSchema function support

Enhances the ArrayField component to support dynamic uiSchema generation through a function-based approach, allowing UI schemas to be conditionally created based on:
- Item data content
- Item index
- Form context

This maintains backward compatibility with existing static uiSchema objects while enabling more flexible, context-aware UI rendering for array items.

Adds comprehensive documentation with examples showing practical use cases and benefits.

* feat(ArrayField): implement dynamic uiSchema.items function support

Enhances ArrayField component to properly handle dynamic uiSchema.items functions:

- Improves type safety with new ArrayElement utility type
- Adds proper function call handling for both normal and fixed arrays
- Ensures graceful error handling and fallback to empty object
- Correctly passes item data, index and formContext to function
- Adds comprehensive test suite for dynamic uiSchema functionality

This feature allows for conditional UI rendering based on item data,
significantly improving form customization capabilities.

* fix: improve error messages for dynamic uiSchema functions

- Clarifies error messages by adding "item at" to provide better context when dynamic uiSchema functions fail
- Adds test case for handling errors in dynamic uiSchema functions for fixed arrays
- Ensures consistent error handling between regular and fixed array implementations

This improves debugging experience for developers using dynamic uiSchema functionality.

* fix(ArrayField): allow undefined UI schema for array items

Updates the type annotations in ArrayField component to accept undefined
as a valid type for itemUiSchema. This preserves backward compatibility
by not defaulting to an empty object when uiSchema.items is undefined.

Previously, the code always defaulted to an empty object which could
cause unexpected behavior when checking for the existence of UI schema.

* fix: preserve undefined values in uiSchema handling

Modifies the ArrayField component to properly handle undefined uiSchema values
instead of converting them to empty objects. This maintains backward compatibility
and prevents unnecessary props from being passed to child components.

The change:
- Only applies truthy results from dynamic uiSchema functions
- Preserves undefined values in static object cases
- Updates snapshots to reflect the removed empty uiSchema objects

This fixes inconsistent behavior when working with conditionally defined UI schemas.

* fix: add id to Fieldset component in ArrayFieldTemplate

Propagates the idSchema.$id to the Fieldset component in the ArrayFieldTemplate,
ensuring consistent and accessible ID attributes in the generated HTML.

Updates test snapshots to reflect the new ID values, replacing previously null
or auto-generated IDs with consistent "root" identifiers and related ARIA
attribute references.

* docs: enhance dynamic uiSchema documentation with examples and best practices

Expands DYNAMIC_UISCHEMA_EXAMPLES.md with:
- Additional examples for falsy return values and fixed arrays
- Detailed notes on handling new items and error cases
- Performance considerations and optimization techniques
- Clarified behavior documentation for dynamic UI schemas

Improves developer experience by providing comprehensive guidance
for implementing dynamic UI schemas effectively.

* fix: replace nanoid with lodash/uniqueId and handle null uiSchema

- Replaces nanoid with lodash/uniqueId for array item ID generation
- Adds prefix "rjsf-array-item-" to generated IDs for better debugging
- Adds null/undefined checks for uiSchema in ArrayField and getUiOptions
- Adds NX Cloud ID to configuration

This change improves robustness when handling undefined UI schemas and
provides more consistent ID generation for array items.

* fix: correct CheckboxWidget event handlers and enhance getUiOptions

- Updates CheckboxWidget _onBlur and _onFocus handlers to use target.checked instead of target.value
- Adds tests for getUiOptions when uiSchema is undefined or null
- Removes nxCloudId from nx.json configuration

* refactor(ArrayField): extract UI schema computation logic and fix checkbox value handling

Refactors ArrayField by extracting computeItemUiSchema helper method to eliminate duplicate code
- Creates a shared private method for computing item UI schema that handles both function and object cases
- Used in both regular arrays and fixed arrays rendering paths
- Improves error handling for dynamic UI schema functions

Fixes CheckboxWidget components in Fluent UI and MUI packages:
- Changes onBlur/onFocus handlers to pass the checkbox checked state instead of its value

Fixes getDisplayLabel to safely handle undefined uiSchema

* fix: pass checkbox state in onFocus and onBlur callbacks

Updates all CheckboxWidget implementations to use the actual checked state
from the event target in onFocus and onBlur handlers instead of the
component's value prop.

This ensures callbacks receive the current checkbox state rather than
potentially stale values from the component props.

* fix: ensure validator passed in Form rerenders & prevent null schema errors

This commit fixes two potential issues:

1. Updates `createComponent` test utility to ensure Form components always receive
   a validator prop when rerendering, preventing potential test failures

2. Adds null checks for rootSchema in SchemaUtils to prevent errors when
   schema is undefined or null

* fix: use current value instead of event target in checkbox onFocus/onBlur

Updates focus and blur event handlers in checkbox widgets across all UI libraries to use the current value state instead of reading from event target.

This ensures consistency across implementations and fixes potential issues where the event target might not correctly reflect the current checkbox state.

* docs: updated the docs - added support for dynamic UI schema in array fields

The change includes:
- documentation with TypeScript examples
- Updated array and uiSchema documentation to reference the new capabilities

Closes #4706

* docs(migration): add documentation for dynamic UI schema for array items

Extends the v6.x upgrade guide to document the new feature that allows dynamic UI schema generation for array items.

Includes a code example demonstrating the feature and references additional documentation.

* Update CHANGELOG.md

Co-authored-by: Heath C <[email protected]>

* Update packages/docs/docs/migration-guides/v6.x upgrade guide.md

Co-authored-by: Heath C <[email protected]>

* Update packages/docs/docs/migration-guides/v6.x upgrade guide.md

Co-authored-by: Heath C <[email protected]>

* Update packages/docs/docs/json-schema/arrays.md

Co-authored-by: Heath C <[email protected]>

* Update packages/docs/docs/api-reference/dynamic-ui-schema-examples.md

Co-authored-by: Heath C <[email protected]>

* Update packages/docs/docs/api-reference/dynamic-ui-schema-examples.md

Co-authored-by: Heath C <[email protected]>

* Update packages/docs/docs/api-reference/uiSchema.md

Co-authored-by: Heath C <[email protected]>

* Update packages/docs/docs/api-reference/dynamic-ui-schema-examples.md

Co-authored-by: Heath C <[email protected]>

* docs: added about correcting checkbox widget focus handlers across all UI libraries

Fixes the checkbox widget to use current value instead of event target in
onFocus/onBlur handlers across all UI libraries:
- core
- chakra-ui
- daisyui
- fluentui-rc
- mui
- primereact
- semantic-ui

Fixes #4704

---------

Co-authored-by: Heath C <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants